<!DOCTYPE html>
<html class="x-admin-sm">

<head>
	<meta charset="UTF-8">
	<title>电子学会比赛管理系统</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
	<link rel="stylesheet" href="./css/font.css">
	<link rel="stylesheet" type="text/css" href="./lib/formSelect/formSelects-v4.css"/>
	<link rel="stylesheet" href="./css/xadmin.css">
	<script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript" src="./js/xadmin.js"></script>
	<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
	<!--[if lt IE 9]>
	<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
	<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
	<![endif]--></head>

<body>
<div class="layui-fluid">
	<div class="layui-row" id="app">
		<form class="layui-form" lay-filter="accountForm">
			<div class="layui-form-item">
				<label for="username" class="layui-form-label">
					<span class="x-red">*</span>用户名</label>
				<div class="layui-input-inline">
					<input type="text" maxlength="30" id="username" placeholder="请输入用户名"  name="userName" required="" lay-verify="required"
					       autocomplete="off"  class="layui-input"></div>
			</div>
			<div class="layui-form-item">
				<label for="username" class="layui-form-label">
					<span class="x-red">*</span>密码</label>
				<div class="layui-input-inline">
					<input maxlength="16" type="text" placeholder="请输入密码" id="passWord" name="passWord" required="" lay-verify="required" autocomplete="off"
					       class="layui-input"></div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label for="desc" class="layui-form-label"><span class="x-red">*</span>角色</label>
				<div class="layui-input-inline">
					<select name="status" id="roles" lay-verify="required">
						<option v-for="role in roleList" :value="role.id">{{role.name}}</option>
					</select>
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label for="desc" class="layui-form-label"><span class="x-red">*</span>赛区</label>
				<div class="layui-input-inline" style="width: 680px">
					<select name="status" xm-select="zone" id="zone" lay-verify="required">
						<!--<option v-for="zone in zoneList" :value="zone.id">{{zone.zoneName}}</option>-->
						<!-- <option value="">全部</option>
						<option value="0">1</option>
						<option value="1">2</option>
						<option value="2">3</option> -->
					</select>
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label for="desc" class="layui-form-label"><span class="x-red">*</span>状态</label>
				<div class="layui-input-inline">
					<select name="status" id="status" lay-verify="required">
						<option value="0">启用</option>
						<option value="1">禁用</option>
					</select>
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label for="desc" class="layui-form-label">备注</label>
				<div class="layui-input-block">
					<textarea maxlength="100" placeholder="请输入备注内容" id="desc" name="desc" class="layui-textarea"></textarea>
				</div>
			</div>
			<div class="layui-form-item">
				<label for="L_repass" class="layui-form-label"></label>
				<button class="layui-btn" lay-filter="add" lay-submit="">确认</button>
				
			</div>
			
		</form>
		<button class="layui-btn" onclick="closewindow()">
			关闭
		</button>
	</div>
</div>
<script src="./lib/formSelect/formSelects-v4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="./js/vue.js"></script>
<script src="./js/jquery.min.js"></script>
<script type="text/javascript" src="./js/abkj/auth/api/adminzone.js"></script>
<script type="text/javascript" src="./js/abkj/auth/api/userrole.js"></script>
<script type="text/javascript" src="./js/abkj/auth/api/role.js"></script>
<script type="text/javascript" src="./js/abkj/match/api/zone.js"></script>
<script type="text/javascript" src="./js/abkj/ext/login.js"></script>
<script type="text/javascript" src="./js/abkj/auth/api/account.js"></script>
<script type="text/javascript" src="./js/abkj/fun_tool.js"></script>
<script type="text/javascript" src="./js/abkj/slAjax.js"></script>
<script>
var form
function request(strParame) {
	var args = new Object( );
	var query = location.search.substring(1);

	var pairs = query.split("&"); // Break at ampersand
	for(var i = 0; i < pairs.length; i++) {
	var pos = pairs[i].indexOf('=');
	if (pos == -1) continue;
	var argname = pairs[i].substring(0,pos);
	var value = pairs[i].substring(pos+1);
	value = decodeURIComponent(value);
	args[argname] = value;
	}
	return args[strParame];
}
var funTool = fun_tool()
var varId = request("id")
// alert(varId)
var app = new Vue({
	el: '#app',
	data: {
		zoneList: [],
		roleList: [],
		mylist:[]
	},
	mounted: function () {
		var vm = this
		$(window).on('load', function () {
			vm.getData()
		})
		layui.use('form', function () {
			form=layui.form
			vm.form = layui.form
			// if (funTool.getUrlParam('id')) {
			// 	vm.form.val('accountForm', {
			// 		userName: 'xxxs'
			// 	})
			// }
		})
	},
	methods: {
		loadZoneList1: function () {
			var vm = this
			var funTool = fun_tool();
			vm.zoneList=funTool.getAdminZoneIds();
			var data=vm.zoneList
			ZonequeryList({}, function (data) {
				vm.zoneList=data
				var formSelects = layui.formSelects
				var varArr = []
				for (var i = 0; i < data.length; ++i) {
					var arrItem = {
						name: data[i].zoneName,
						value: data[i].id,
						selected:false
					}
					varArr.push(arrItem)
				}
				formSelects.data('zone', 'local', {
					arr: varArr
				})
				vm.mylist=varArr
				vm.loadAdminZone(varId)
				vm.loadUserRole(varId)

			})

		},
		loadZoneList: function () {
			var vm = this
			var funTool = fun_tool();
			vm.zoneList=funTool.getAdminZoneIds();
			var data=vm.zoneList
			ZonequeryList({}, function (data) {
				vm.zoneList=data
				var formSelects = layui.formSelects
				var varArr = []
				for (var i = 0; i < data.length; ++i) {
					var arrItem = {
						name: data[i].zoneName,
						value: data[i].id,
						selected:false
					}
					varArr.push(arrItem)
				}
				formSelects.data('zone', 'local', {
					arr: varArr
				})
				// vm.mylist=varArr
				vm.loadRoleList()

			})


			// ZonequeryList({}, function (data) {
			// 	vm.zoneList = data
			// 	var formSelects = layui.formSelects
			// 	var varArr = []
			// 	for (var i = 0; i < data.length; ++i) {
			// 		var arrItem = {
			// 			name: data[i].zoneName,
			// 			value: data[i].id
			// 		}
			// 		varArr.push(arrItem)
			// 	}
			// 	formSelects.data('zone', 'local', {
			// 		arr: varArr
			// 	})
			// 	vm.loadRoleList()
			// }, function (status, message) {
			// 	alert(message)
			// })
		},
		loadAdminZone:function(varId){
			console.log(varId)
			var param={
				eq:{
					adminId:varId
				}
			}
			var vm = this
			AdminZonequeryList(param,function(data){

				  // alert(JSON.stringify(vm.mylist))

					var mylist1=data
					// alert(JSON.stringify(mylist1))
					// alert(zoneId)
					setTimeout(function(){
            for (i=0;i<vm.mylist.length;i++){
                     for (j=0;j<mylist1.length;j++){
											    if (mylist1[j].zoneId==vm.mylist[i].value){
														vm.mylist[i].selected=true
														break
													}
										 }
						}
           var formSelects = layui.formSelects
					 formSelects.data('zone', 'local', {
						 arr: vm.mylist
					 })
						form.render("select")
					},2000)

			})
		},
		loadUserRole:function(varId){
			// alert(varId)
			var param={
				eq:{
					adminId:varId
				}
			}
			UserRolequeryList(param,function(data){
				// alert(JSON.stringify(data))
				var roleid
				for (i=0;i<data.length;i++){
					  if (varId==data[i].userId){
							  roleid=data[i].roleId
								break
						}
				}
			   setTimeout(function(){
					 var roles=document.getElementById("roles")
					 // alert(roles.options.length)
					 // alert(roleid)
					 for (i=0;i<roles.options.length;i++){
						 // alert(roles.options[i].value)
								if (roles.options[i].value==roleid){
									// alert("dui")
									roles.options[i].selected=true
									break
								}
					 }
					 form.render("select")
				 },1000)
			})
		},
		loadAccount: function () {
			var vm = this
			// alert(varId)
			if (varId==null||varId==''||varId==undefined){

				document.getElementById("username").readonly=false

			  vm.loadRoleList2()
				setTimeout(function(){
					 form.render()
				},1000)

			}
			if (varId != null) {
				document.getElementById("username").readonly=true
				AccountgetObj(varId, function (data) {
					 // alert(JSON.stringify(data))
					// alert(data.userName)
					document.getElementById("username").value=data.userName
					document.getElementById('passWord').value=data.passWord
					var isProhibit=data.isProhibit
					var status1=document.getElementById("status")
					for (i=0;i<status1.options.length;i++){
						   if (status1.options[i].value==isProhibit){
								 status1.options[i].selected=true
								 break
							 }
					}
					// form.render()
          // vm.loadZoneList()
					vm.loadZoneList1()


					// alert(JSON.stringify(roleList))

					//初始化页面控件


				})
			}
		},
		loadRoleList: function () {
			var vm = this
			RolequeryList({}, function (data) {
				// alert(JSON.stringify(data))
				vm.roleList = data
				vm.loadAccount()
			}, function (status, message) {
				alert(message)
			})
		},
		loadRoleList2: function () {
			var vm = this
			RolequeryList({}, function (data) {
				// alert(JSON.stringify(data))
				vm.roleList = data
				vm.loadAccount()
			}, function (status, message) {
				alert(message)
			})
		},
		getData: function () {
			this.loadZoneList()
		}
	}
})

</script>
<script>
layui.use('laydate',
	function () {
		var laydate = layui.laydate

		//执行一个laydate实例
		laydate.render({
			elem: '#start' //指定元素
		})

		laydate.render({
			elem: '#start1' //指定元素
		})
		laydate.render({
			elem: '#start2' //指定元素
		})
		//执行一个laydate实例
		laydate.render({
			elem: '#end' //指定元素
		})
		laydate.render({
			elem: '#end1' //指定元素
		})
		laydate.render({
			elem: '#end2' //指定元素
		})

	})

layui.use(['form', 'layer'],
	function () {
		$ = layui.jquery
		var form = layui.form,
			layer = layui.layer

		//自定义验证规则
		form.verify({
			nikename: function (value) {
				if (value.length < 5) {
					return '昵称至少得5个字符啊'
				}
			},
			pass: [/(.+){6,12}$/, '密码必须6到12位'],
			repass: function (value) {
				if ($('#L_pass').val() != $('#L_repass').val()) {
					return '两次密码不一致'
				}
			}
		})
        
		//监听提交
		form.on('submit(add)',
			function (data) {
				var formSelects = layui.formSelects
				console.log(data)
				zonsestring=formSelects.value('zone', 'val')
				// zonsestring=zonsestring.toString()
				var varAccount = {
					userName: data.field.userName,
					passWord: data.field.passWord,
					isProhibit: data.field.status,
					remark: data.field.remark,
					zoneId: zonsestring,
				}
				varAccount.roleIds = []
				varAccount.roleIds.push($('#roles').val())
				// alert(JSON.stringify(varAccount))
				console.log(JSON.stringify(varAccount))
				if(varId != null){
					updateAccount(varAccount, function (data) {
						layer.alert('修改成功', {
								icon: 6
							},
							function () {
								// 获得frame索引
								var index = parent.layer.getFrameIndex(window.name)
								//关闭当前frame
								parent.layer.close(index)
								xadmin.father_reload()
							})
						}, function (status, message) {

					})
				}else{
					addAccount(varAccount, function (data) {
					layer.alert('增加成功', {
							icon: 6
						},
						function () {
							// 获得frame索引
							var index = parent.layer.getFrameIndex(window.name)
							//关闭当前frame
							parent.layer.close(index)
							xadmin.father_reload()
						})
					}, function (status, message) {

					})
				}

				//发异步，把数据提交给php

				return false
			})

	})
	function closewindow(){
		                       var index = parent.layer.getFrameIndex(window.name)
								//关闭当前frame
								parent.layer.close(index)
								xadmin.father_reload()
	}
	</script>
<script>var _hmt = _hmt || [];
(function () {
	var hm = document.createElement('script')
	hm.src = 'https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190'
	var s = document.getElementsByTagName('script')[0]
	s.parentNode.insertBefore(hm, s)
})()</script>
</body>

</html>
